
//导入html-webpack-plugin包
var htmlwp = require('html-webpack-plugin')

module.exports={
	// 1.0 定义打包的入口文件路径
	entry:'./src/main.js',
	output:{
		path:'./src',   //打包以后的文件存放目录
		filename:'build.js'  // 打包以后生成的文件名称
	},
	module:{
		loaders:[
			{
				// 将当前项目中所有的.js文件都要进行es6转es5操作，node_moudels除外
				test:/\.js$/,   //表示当前要打包的文件的后缀正则表达式
				// loader:'babel-loader?presets[]=es2015', //如果写到这里，将来在打包.vue文件的时候会报错，表示先利用css-loader解析.css文件，再调用style-loader打包
				loader:'babel-loader',
				exclude:/node_modules/  //node_modules中的所有.js文件不去转换，提高打包性能
			},
			{
				// 打包css文件
				test:/\.css$/,   //表示当前要打包的文件的后缀正则表达式
				loader:'style-loader!css-loader' //表示先利用css-loader解析.css文件，再调用style-loader打包
			},
			{
				// 打包 sass文件
				test:/\.scss$/,   //表示当前要打包的文件的后缀正则表达式
				loader:'style-loader!css-loader!sass-loader' //实现sass文件的打包
			},
			{
				// 打包less文件
				test:/\.less$/,   //表示当前要打包的文件的后缀正则表达式
				loader:'style-loader!css-loader!less-loader' //实现sass文件的打包
			},
			{
				// 打包url()请求的资源文件
				test:/\.(png|jpg|gif|ttf|svg)$/,   // 注意url可能请求多个资源，所以将来在项目中通过url导入的资源扩展名必须配置在这里
				// loader:'url-loader'  //这种配置会将图片变成一个base64的字符串存储到build.js中，如果图片很大的话，那么会造成build.js也比较大，加载的时候会导致效率低下
				loader:'url-loader?limit=40000' //限制图片的大小如果<40k则把他当做base64字符串存储到build.js中，如果>40k 则单独将图片存放到磁盘上，将路径打包进去bulid.js
			},
			{
				// 打包vue文件
				test:/\.vue$/,
				loader:'vue-loader'
			},
			{
				test:/vue-preview.src.*?js$/,
				loader: 'babel-loader'
			}
		]
	},
	babel:{
		 presets: ['es2015'],
		 plugins: ['transform-runtime']  //这句代码就是为了解决打包.vue文件不报错
	},
	resolve: {
	        /**
	         * Vue v2.x之后NPM Package默认设置只会生成runtime-only 版本，若要使用standalone功能則需如下设置
	         * 否则会报错：Failed to mount component: template or render function not defined.
	         */
	        alias: {
	            vue: 'vue/dist/vue.min.js'
	        },
	        extensions: ['', '.js', '.vue']
	    },

	plugins:[
		new htmlwp({
			title: '首页',
			filename: 'index.html',
			template: 'index1.html'
		})
	]

}